<template>
    <div>
        <detail
            :title="this.info.title"
            :uploadsDate="this.info.date"
            type="video"
            :video="this.info.link"
            :class="{ 'footer-download': this.footer.isDownload, 'footer-default': this.footer.isDefault, 'footer-detail': this.footer.isDetail  }"></detail>
        <mfooter :download="this.download" title="完善个人资料，下载高清视频" :type="this.footer.type" :link="this.info.link"></mfooter>
    </div>
</template>

<script>
    import Detail from '@/components/Detail'
    import Mfooter from '@/components/Mfooter'
    import {Util} from '@/js/Util'
    import {AlertModule} from 'vux'
    import {Config} from '@/js/Config'
    export default {
        components: {
            Detail,
            Mfooter,
            AlertModule
        },
        mounted() {
            // 微信登录
            this.loginWechat(Util.getUrlParam('code'));
            Util.setFooterClass(this);
            this.isFirst();
        },
        data() {
            return {
                info: {
                    title: '',
                    date: '',
                    link: ''
                },
                footer: {
                    type: 'detail',
                    isDefault: false,
                    isDetail: false,
                    isDownload: false
                },
                download: {
                    query: [],
                    action: 'video'
                }
            }
        },
        methods: {
            // 授权登录
            loginWechat(code) {
                let _self = this;
                // 判断是否有账号信息
                if (!sessionStorage.getItem('MeiJingKu_openid')) {
                    if (!code) {
                        location.href = 'https://open.weixin.qq.com/connect/oauth2/authorize?appid=' + Config._appid + '&r' +
                                'edirect_uri=' + encodeURIComponent(location.protocol + '//' + location.hostname + '/web/#/MeiJingSuiPai/video/detail?id=' + this.$route.query.id) + '&response_type=code&scope' +
                                '=snsapi_userinfo&state=1#wechat_redirect';
                    }
                }else {
                    this.init();
                    return false;
                }
                this
                    .$vux
                    .loading
                    .show({text: 'Loading'});
                // 测试接口
                // this.$http.post('user/LoginByOpenid/v1?openid=1').then(response => {
                this.$http.post('user/LoginByCode/v1?code=' + code).then(response => {
                        this
                            .$vux
                            .loading
                            .hide();
                        let result = response.data;
                        if (!result.code) {
                            sessionStorage.setItem('MeiJingKu_openid', result.data.openid);
                        } else {
                            location.href = 'https://open.weixin.qq.com/connect/oauth2/authorize?appid=' +
                                            Config._appid + '&redirect_uri=' + encodeURIComponent(location.protocol + '//' + location.hostname + '/web/#/MeiJingSuiPai/video/detail?id=' + _self.$route.query.id) + '&respon' +
                                            'se_type=code&scope=snsapi_userinfo&state=1#wechat_redirect';
                        }
                        this.init();
                    }, response => {
                        Util.errorWarning(this);
                    });
            },
            init() {
                this.$vux.loading.show({text: 'Loading'});
                let id = this.$route.query.id,
                    openid = sessionStorage.getItem('MeiJingKu_openid');
                // 不存在id
                if(!id) {
                    this.$router.push({
                        name: 'MeiJing_index'
                    });
                    return false;
                }
                // 获取视频详情
                this.$http.get('team/VideoDetail/v1?id=' + id + '&openid=' + openid).then(response => {
                    let result = response.data;
                    sessionStorage.setItem('MeiJingKu_auth', result.data.auth);
                    this.info.link = result.data.link;
                    this.info.title = result.data.name;
                    this.info.date = result.data.time;
                    this.download.query = [result.data.id];
                    console.log(this.info.link);
                }, response => {
                    Util.errorWarning(this);
                });
                this.$vux.loading.hide();
            },
            // 判断是否为直接进入
            isFirst() {
                // 存在 sessionStorage，表示通过正常操作进入页面
                if(sessionStorage.getItem('MeiJingKu_history')) {
                    // 添加浏览记录
                    Util.setHistory(this);
                }
            }
        },
        watch: {
            '$route': 'setFooterClass'
        }
    }
</script>

<style lang="less" scoped="scoped">
    .footer-default,
    .footer-detail {
        margin-bottom: 12rem !important;
    }

    .footer-download {
        margin-bottom: 15rem !important;
    }
</style>